<template>
  <div>
    <div>
      <el-table
        :data="tableData"
        stripe
        style="width: 100%">
        <el-table-column
          prop="date"
          label="日期"
          width="180">
        </el-table-column>
        <el-table-column
          prop="name"
          label="姓名"
          width="180">
        </el-table-column>
        <el-table-column
          prop="address"
          label="地址">
        </el-table-column>
      </el-table>
    </div>

    <div id="list_page">
      <el-pagination
        background
        layout="prev, pager, next"
        :page-size="6"
        :total="60"
        @current-change="page">
      </el-pagination>
    </div>
<!--    {{title}}-->

  </div>
</template>

<script>
    export default {
        name: "UserList",
        data() {
            return {
                title:"6666",
                tableData:[]
            }
        },
        beforeRouteEnter:(to,from,next)=>{
          console.log("进入方法之前执行")
            next(vm => {
                vm.getData();
            })
        },
        beforeRouteLeave:(to,from,next)=>{
            console.log("退出方法后执行")
            next();
        },
        // created(){
        //
        // },
        methods:{
          page(currentPage){
              alert(currentPage);
          },
          getData(){
            var that = this;
            this.axios({
              method:"get",
              url:"/static/mock/user.json",
              // 传递参数
              // params: {
              //     key: value
              // },
              // 设置请求头信息
              // headers: {
              //     key: value
              // }
              responseType: 'json'
            }).then(response=>{
                console.log(response)
                that.tableData =response.data;
            }).catch(response=>{
              console.log(response);
            })
          }
        }
    }
</script>

<style scoped>


</style>
